/<template>
  <div>
    <div class="content-head">
      <BiForm>
        <BiFormItem label="用户ID">
          <template slot="content">
            <el-input
              v-model="member_id"
              placeholder="请输入用户ID"
            ></el-input>
          </template>
        </BiFormItem>
        <BiFormItem>
          <template slot="button">
            <el-button
              style="margin-left: 10px"
              type="primary"
              :disabled="loading"
              :loading="loading"
              @click="startSearch('查询')"
            >查询</el-button>
            <el-button @click="reset">重置</el-button>
          </template>
        </BiFormItem>
      </BiForm>
    </div>
    <div class="table-table">
      <BiTable
        :loading="loading"
        :data="tableData"
        size="medium"
        :column="tableColums"
        fixed="sticky"
        fixed-offset="50"
        pagination
        layout="total, prev, pager, next"
        :auto-scroll="false"
        :total="page_info.total"
        :page.sync="page_info.page"
        :limit.sync="page_info.page_size"
        @pagination="handlePageChange"
      >
      </BiTable>
    </div>
  </div>
</template>

<script>
import { couponMemberList } from '@/api/coupons'
export default {
  props: {
    rowInfo: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      loading: false,
      member_id: '',
      page_info: {
        page: 1,
        page_size: 20,
        total: 0
      },
      tableData: [],
      tableColums: [
        {
          label: '用户ID',
          prop: 'member_id'
        },
        {
          label: '领取时间',
          prop: 'receive_time'
        }
      ]
    }
  },
  mounted() {
    this.obGetList()
  },
  methods: {
    reset() {
      this.member_id = ''
    },
    startSearch() {
      this.page_info.page = 1
      this.obGetList()
    },
    async obGetList() {
      this.loading = true
      try {
        const res = await couponMemberList({
          member_id: this.member_id,
          coupon_id: this.rowInfo.id
        })
        if (res.status_code === 1) {
          this.tableData = res.data.data
          this.page_info = res.data.page_info
        }
        this.loading = false
      } catch (error) {
        console.log(error)
        this.loading = false
      }
    },
    handlePageChange(value) {
      this.page_info.page = value.page
      this.obGetList()
    }
  }
}
</script>

<style lang="scss" scoped>
.content-head {
  padding: 20px 20px 0 20px;
}
.table-table {
  padding: 0 20px;
}
</style>